    body {
     font: normal 0.8em/1.3em verdana,arial;
     margin-top: 3em;
    }

    a {
     text-decoration:none;
    }

    pre,code {font-size:1.2em; color: green}

    .tipContent {
     border: 1px solid #c0c0c0;
     border-bottom-right-radius: 5px;
     border-top-right-radius: 5px;
     box-shadow: 2px 2px 8px #999;
     top: -5000px;
     min-width: 50px;
     max-width: 400px;
     max-height: 400px;
     min-height: 1em;
     overflow: hidden;
     padding: 0;
     margin:0;
     position: absolute;
     font-style: normal;
     cursor: default;
     background: #fffff0;
     color: #000;
     opacity: 0;
    }

    .tbody .resizehandleY {
     position: absolute;
     background-color: transparent;
     bottom: 0;
     right: 0;
     left: 0;
     height: 4px;
     cursor: s-resize;
     overflow: hidden;
     z-index: 1000000;
    }

    .tipContent .resizehandleX {
     position: absolute;
     background-color: transparent;
     top: 1em;
     bottom: 0;
     right: 0;
     cursor: e-resize;
     width: 4px;
     z-index: 1000000;
     overflow: hidden;
    }
    .resizehandleX:hover{
      border-right: 3px dotted #999;
    }
    .resizehandleY:hover {
      border-bottom: 3px dotted #999;
    }

    .draghandle {
      position:absolute;
      left: 0;
      height: 12px;
      width: 12px;
      top: 0;
      background-image: url();
      background-color: transparent;
      background-position: 8px 4px;
      background-repeat: no-repeat;
      padding: 2px 10px;
    }

    .tbody.white{
     background:white !important;
    }

    .tipContent p {
     margin-top: 0.5em;
    }

    .header {
     /*margin: -1px -1px 0 -1px;*/
     text-align: center;
     padding: 2px 5px;
     background-color: #5d5e93;
     color: #fff;
     display: block;
     border-top-right-radius: 5px;
     border-bottom: 1px solid #fff;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
    }

    .header.fix {
      /*background-color: #acaeca;*/
      padding: 2px 40px 2px 28px;
    }

    .dragresizebox {
      /* [!important] to prevent inheritance from parent */
      background: #FFFFF0;
      opacity: 0.2 !important;
      position: absolute;
      cursor: move;
      border: 2px dotted #000 !important;
      border-bottom-right-radius: 5px;
      padding: 0 !important;
      margin: 0 !important;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity:20)";
      filter: alpha(opacity=20); /* IE7 and under */
    }


    .fixedcloser {
     margin: 0 4px 0 15px;
     background: transparent url(fixed.png) no-repeat 99.5% center;
     position:absolute;
     right: 1px;
     top: 4px;
     width: 12px;
     height: 12px;
     cursor: pointer;
     cursor: hand;
    }

    .fixedcloser.hastooltip,
    .draghandle.hastooltip{
      border-bottom: none !important;
      margin-bottom: 0;
      cursor: pointer;
      cursor: hand;
    }

    .fixedcloser:hover {
      background-image: url(closefixed.png);
    }

    .tbody {
     overflow-y: auto !important;
     overflow-x: hidden;
     height: auto;
     max-height: 375px;
     min-height: 1em;
     padding: 2px 6px 4px 6px;
     font-style: normal;
     font-size: 0.9em;
     line-height: 1.3em;
     display: block !important;
     margin:0 0 0 -1px;
     white-space: normal;
     border-bottom-right-radius: 5px;
     border-top-right-radius: 5px;
    }

    .fadein {
      opacity: 1;
      -moz-transition: opacity 0.2s ease-in-out;
      -webkit-transition: opacity 0.2s ease-in-out;
      transition: opacity 0.2s ease-in-out;
    }

    .fadeout {
      opacity: 0;
    }

    .hastooltip, .ttdemo {
     cursor: default;
     border-bottom: 1px solid #000 !important;
     /*IE compensate for the border*/
     margin-bottom: -1px;
    }

    a.hastooltip {
     cursor:pointer;
     cursor:hand;
    }

    .hastooltip:hover {
     color: red;
     border-color: transparent !important;
    }

    .triangleup {
     width: 0;
     height: 0;
     border-left: 6px solid transparent;
     border-right: 6px solid transparent;
     border-top: 6px solid #fff;
     display: inline-block;
     position: absolute;
     cursor: pointer;
     cursor: hand;
     top: 8px;
     right: 18px;
    }

    .triangledown {
     width: 0;
     height: 0;
     border-left: 6px solid transparent;
     border-right: 6px solid transparent;
     border-bottom: 6px solid #fff;
     display: inline-block;
     position: absolute;
     cursor: pointer;
     cursor: hand;
     top: 7px;
     right: 18px;
    }

    .help {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      border-bottom: 1px solid #999;
      padding: 2px 10px 2px 10px;
      background-color: #ffffd0;
      height: 2em;
      line-height: 2em;
    }

    .help .helpitem{
      margin-right: 8px;
      font-size: 1.1em;
      color: blue;
      height: 100%;
      padding: 1px 5px;
      background-color: #fff !important;
      z-index: 10;
    }

    .help .hastooltip {
      border: 1px solid blue;
    }

    .help .hastooltip:hover {
      border: 1px solid red !important;
      color: #000 !important;
      background: #eee !important;
    }
    ul li.hastooltip {
      border-bottom: none !important;
      margin-left: -2em;
      list-style: none;
    }

    .hastooltip.clean,.hastooltip.clean:hover{
      border: none !important;
      border-bottom: 1px dashed #c0c0c0 !important;
      font: inherit !important;
      color: inherit !important;
      background: inherit !important;
    }